<template>
  <div>
    <scoped2 />
    <p>-----------</p>
    <h2>H2内容在 scoped1内 这里是蓝色</h2>
    <h3>H3内容在 scoped1内,这里是蓝色；scoped3里面是红色，没有设置scoped做限制，并不会污染scoped1的内容
    </h3>
    <pre>
        &lt;style scoped>
            外层 >>> 第三方组件 {
                样式
            }
        &lt;/style>
    </pre>
  </div>
</template>

<script>
import scoped2 from './scoped2'
export default {
  name: 'scoped1',
  components: {
    scoped2
  },
  data () {
    return {}
  }
}
</script>

<style lang='less' scoped>
h2,h3 {
  color: blue;
}
</style>
